import QtQuick 2.15
import QtQuick.Controls 2.15

Item {
    id: steamAchievement
    width: 400
    height: 100
    
    signal finished()
    
    property string title: "获得成就!"
    property string context: "成就描述"
    property string imgSrc: "../image/anim/Hellow_World.png"
    property bool noclip: false
    
    // 初始位置在屏幕右侧外部
    x: parent.width
    y: parent.height - height - 20 // 稍微向上偏移，避免紧贴底部
    
    // 背景
    Rectangle {
        id: background
        anchors.fill: parent
        gradient: Gradient {
            GradientStop { position: 0.0; color: "#333744" }
            GradientStop { position: 1.0; color: "#0F151C" }
        }
        radius: 5
        
        /* border.color: "#40000000"
        border.width: 2 */
    }
    
    // 装饰图案
    Image {
        id: decoration
        source: ""
        width: parent.width * 0.7
        height: width
        anchors.right: parent.right
        anchors.verticalCenter: parent.verticalCenter
        opacity: 0.3
    }
    
    // 旋转光效
    Image {
        id: lightEffect
        source: "../image/anim/light.png"
        width: parent.height * 1.2
        height: parent.height * 1.2
        anchors {
            centerIn: achievementIcon
        }
        opacity: 0.8
        
        RotationAnimation on rotation {
            from: 0
            to: 360
            duration: 2000
            loops: Animation.Infinite
            running: true
        }
    }

    // 成就图标
    Image {
        id: achievementIcon
        source: imgSrc
        width: parent.height * 0.68
        height: parent.height * 0.68
        sourceClipRect: noclip ? undefined : Qt.rect(61, 20, 128, 128)
        clip: true
        anchors {
            left: parent.left
            leftMargin: parent.width * 0.05
            verticalCenter: parent.verticalCenter
        }
        fillMode: Image.PreserveAspectFit
        
        // 金色边框效果
        Rectangle {
            anchors.fill: parent
            color: "transparent"
            border.color: "#FFDD00"
            border.width: steamAchievement.width / 250
            radius: 2
        }
    }
    
    // 成就标题
    Text {
        id: titleText
        text: title
        color: "white"
        font {
            family: steamFont.name
            pixelSize: parent.width / 250 * 12
        }
        anchors {
            left: achievementIcon.right
            leftMargin: parent.width * 0.05
            top: parent.top
            topMargin: parent.height * 0.2
        }
    }
    
    // 成就描述
    Text {
        id: contextText
        text: context
        color: "#8B929A"
        font {
            family: steamFont.name
            pixelSize: parent.width / 250 * 12
        }
        anchors {
            left: achievementIcon.right
            leftMargin: parent.width * 0.05
            top: titleText.bottom
            topMargin: parent.height * 0.1
        }
    }
    
    // 显示动画
    SequentialAnimation {
        id: showAnimation
        running: false
        
        // 滑入动画
        NumberAnimation {
            target: steamAchievement
            property: "x"
            from: parent.width
            to: parent.width - steamAchievement.width - 20
            duration: 500
            easing.type: Easing.OutBack
        }
        
        // 停留时间
        PauseAnimation { duration: 2500 }
        
        // 淡出动画
        NumberAnimation {
            target: steamAchievement
            property: "opacity"
            from: 1.0
            to: 0.0
            duration: 500
        }
        
        onFinished: {
            steamAchievement.finished();
        }
    }
    
    // 显示成就
    function show() {
        opacity = 1.0;
        showAnimation.start();
    }
}